<template>
    <div style="width: 340px; height: 630px; margin: 10px; background-color: #efefef; position: fixed;">
      <div style="text-align: center; font-size: 22px; margin-top: 150px;">欢迎登录蜗牛生鲜</div>
      <div style="text-align: center; margin-top: 50px;">
        <input placeholder="输入手机号" type="text" v-model="phone" style="padding-left: 15px; width: 210px; height: 35px; border: 1px solid gray; border-radius: 8px;">
      </div>

      <div style="text-align: center; margin-top: 50px;">
        <input placeholder="输入密码" type="text" v-model="password" style="padding-left: 15px; width: 210px; height: 35px; border: 1px solid gray; border-radius: 8px;">
      </div>
      <div style="margin-top: 20px; text-align: center;">
        <button :enable="btnState"  @click="submitForm" style="background-color: cadetblue; border-radius: 5px; width: 60px; height: 30px; border: none; color: white; margin-right: 10px;">登录</button>
      </div>
      <div style="text-align: center; margin-top: 260px;">
        <input type="checkbox" onchange="doChange"> <span style="color: #409EFF">我已阅读并同意《服务条款》、《隐私政策》</span>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    data(){
    return {
      btnState: false,
      phone:'',
  
      
  }
    },
    methods: {
          
        submitForm() {
          
          this.$axios.get('api/app/user/Userlogin?phone='+this.phone)
          .then(res =>{
            console.log(res.data)
            sessionStorage.setItem("phone",this.phone)
             if(res.data.code==200){
              this.$router.push('firstPage')
            }else{
              alert("手机号错误！")
            }
          })
        },
        
        doChange(){
            this.btnState = true;
        }
      }
  }
  </script>
  
  <style scoped> 
  
  </style>